import React, { useMemo } from 'react';
import { TreeSelect } from 'antd';
import pageStyles from '@/common/pageLayout.less';

import { SchemaManageAPI } from '../../type';
interface IPropsType {
  id?: string;
  value?: any;
  onChange?: any;
  opt: SchemaManageAPI.ISearchList;
  type: string;
}

export const SearchTreeSelect: React.FC<IPropsType> = (props) => {
  const treeData = useMemo(() => {
    let loopTree = (dataTree: any) => {
      return dataTree?.map((item: any) => {
        const itemName: string = props?.opt?.treeName ? item?.[props?.opt?.treeName] : item?.name;
        const itemID: string = props?.opt?.treeID ? item?.[props?.opt?.treeID] : item?.value;
        return {
          title: (
            <div title={item?.treeName ? item?.treeName : itemName} className={pageStyles['over-flow-hidden']}>
              {itemName}
            </div>
          ),
          searchTitle: itemName,
          key: itemID,
          value: itemID,
          disabled: item?.disabled ? item?.disabled : props?.opt?.orginType && item.children && item?.children?.length > 0 ? true : false,
          children: item?.children && item?.children?.length > 0 ? loopTree(item?.children) : null,
        };
      });
    };
    return loopTree(props?.opt?.dataSource);
  }, [props?.opt?.dataSource]);

  return (
    <TreeSelect
      onChange={props?.onChange}
      value={props?.value}
      allowClear={props?.opt?.allowClear}
      placeholder={props?.opt?.placeholder}
      treeData={props?.opt?.placeholder ? treeData : []}
      treeNodeFilterProp={'searchTitle'}
      showSearch={true}
      fieldNames={props?.opt?.fieldNames}
      popupClassName={pageStyles['treeSelectPopupClassName']}
    />
    // <>
    //   <Col
    //     md={props?.opt?.md ?? 4}
    //     sm={props?.opt?.sm ?? 24}
    //     key={handColKey()?.[0]}
    //   >
    //     <Form.Item name={'ceshi1'}>
    //       <Input />
    //     </Form.Item>
    //   </Col>
    //   <Col
    //     md={props?.opt?.md ?? 4}
    //     sm={props?.opt?.sm ?? 24}
    //     key={handColKey()?.[1]}
    //   >
    //     <Form.Item name={'ceshi2'}>
    //       <Input />
    //     </Form.Item>
    //   </Col>
    // </>
  );
};
